<template>
	<view class="content">
        <!-- 头部背景 -->
        <view class="header-bg u-flex u-row-center u-col-bottom">
		    <u--image :showLoading="true" src="/static/logo.png" width="120rpx" height="120rpx"></u--image>
        </view>

        <!-- content -->
        <view class="box">
            <view class="u-font-48 font-bold">登录</view>
            <view class="u-m-t-20 u-font-28 uni-gery-color">欢迎来到安薪乐·项目端</view>
            <!-- form -->
            <u--form class="u-m-t-60" labelPosition="left" :model="login" :rules="rules" ref="login">
                <u-form-item label="" prop="username" borderBottom ref="username">
                    <u--input v-model="login.username" clearable border="none" 
                        placeholder="请输入账号" placeholderClass="uni-placeholder">
                    </u--input>
                </u-form-item>
                <u-form-item label="" prop="password" borderBottom ref="password" class="u-m-t-20">
                    <u--input v-model="login.password" clearable border="none"
                        placeholder="请输入密码" placeholderClass="uni-placeholder"
                        :password="login.showPassword" 
                        :suffixIcon="login.showPassword?'eye-fill':'eye-off'" 
                        @icon="login.showPassword=!login.showPassword">
                    </u--input>
                </u-form-item>
            </u--form>
            <!-- forget -->
            <view v-if="false" class="u-m-t-24 u-text-right u-font-26 uni-gery-color" @click="forgetPassword">忘记密码</view>
            <!-- login -->
            <u-button class="u-m-t-100" style="width:500rpx" type="primary" shape="circle" text="登录" @tap="submit"></u-button>
        </view>
        <!-- 用户使用协议&隐私政策 -->
        <view class="u-flex u-row-center">
            <u-checkbox-group @change="checkboxChange">
                <u-checkbox size="16" :checked="isConsent" label="" name="2" ></u-checkbox>
            </u-checkbox-group>
            <view class="u-font-28">
                我已阅读并同意
                <text class="uni-higt-color" @tap.stop="goAgreement(1)">《用户使用协议》</text>和
                <text class="uni-higt-color" @tap.stop="goAgreement(2)">《隐私政策》</text>
            </view>
        </view>


        <!-- 开发时测试使用 -->
        <!-- <view class="u-m-t-20 uni-area">
            <view class="u-font-26 u-text-center uni-gery-color">点击地址切换测试地址,仅开发版本</view>
            <view class="u-m-t-10 u-flex u-row-center u-font-28">
                <text class="u-m-r-16 uni-gery-color">当前使用地址:</text>
                <text @tap.stop="baseUrlShow=true">{{baseUrl}}</text>
            </view>
        </view> -->
        <u-picker :show="baseUrlShow" :columns="columns"
            :closeOnClickOverlay="true" @cancel="baseUrlShow=false" @close="baseUrlShow=false" 
            @confirm="confirm">
        </u-picker>

        <!-- 提示组件 -->
        <u-toast ref="uToast"></u-toast>
	</view>
</template>

<script>
import config from 'configs/config.js'
export default {
    data() {
        return {
            login: {
                username: '', // 110101199003074258
                password: '',  // bt123456
                showPassword: true, // 默认显示密码
            },
            rules: {
                username: {
                    type: 'string',
                    required: true,
                    message: '请输入账号',
                    trigger: ['blur', 'change']
                },
                password:{
                    required: true,
                    message: '请输入密码',
                    trigger: ['blur', 'change']
                }
            },
            isConsent: false, // 隐私政策

            baseUrlShow: false,
            columns:[
                [
                    '公司测试地址?http://220.171.59.122:8083/',
                    '测试专用地址?http://220.171.59.122:28229/',
                    '技术联调地址?http://18899171257.picp.vip/',
                    '生产测试地址?http://36.189.206.149:7007/',
                    '生产正式地址?http://36.189.206.149:7003/',
                ]
            ],
            baseUrl: uni.getStorageSync('baseUrl')?uni.getStorageSync('baseUrl'):'http://220.171.59.122:8083/'
        }
    },

    onLoad() {
        // 回填账号密码
        const usernamePassword = uni.getStorageSync("usernamePassword")
        if( usernamePassword ){
            this.login.username = usernamePassword.username
            this.login.password = usernamePassword.password
        }
    },

    methods: {
        // 忘记密码
        forgetPassword(){
            uni.navigateTo({
                url: '/pages/login/forget-password',
            })
        },


        // 复选框的改变事件
        checkboxChange(n){
            if( n.length==0 ){
                this.isConsent = false
            }else{
                this.isConsent = true
            }
        },
        goAgreement(type){
            uni.navigateTo({
                url:'/pages/my-bag/agreement?type='+type
            })
        },


        // 登陆
        submit(){
            this.$refs.login.validate().then(res => {
                if( !this.isConsent ){
                    uni.$u.toast('请阅读并同意用户使用协议和隐私政策相关内容')
                    return false
                }
                uni.showLoading({ title:'明文加密中' })
                this.$request(this,this.$apis.encryptPassword,{str:this.login.password}).then(data=>{
                    // console.log('加密明文密码',data)
                    const login = {
                        username: this.login.username,
                        password: data.msg,
                        appTerminal: 'xmd'
                    }
                    uni.showLoading({ title:'登录中' })
                    this.$request(this,this.$apis.login,login).then(data1=>{
                        // console.log('登陆',data1)
                        uni.setStorageSync("Authorization",data1.token)
                        this.getUserInfo()
                    }).then()
                }).then()
            }).catch(errors => {})
        },

        // 获取用户信息
        getUserInfo(){
            uni.showLoading({ title:'权限判断中' })
            this.$request(this,this.$apis.userInfo,{}).then(res=>{
                // console.log('权限判断',res)
                if( res.isLoginApp && res.terminal == 'xmd' ){
                    uni.setStorageSync("userInfo",res)
                    uni.setStorageSync("usernamePassword",{ username:this.login.username,password:this.login.password })
                    uni.switchTab({ url: '/pages/tabs/home' })
                }else{
                    uni.clearStorage();
                    this.$tools.uToast(this, 'warning','', '当前账号暂无权限登陆安薪乐项目端' )
                }
            }).then()
        },


        // 切换地址
        confirm(e){
            uni.showLoading({ title:'切换中' })
            uni.setStorageSync('baseUrl',e.value[0].split('?')[1])
            this.baseUrlShow = false
            setTimeout(()=>{
                uni.hideLoading()
                this.baseUrl = e.value[0].split('?')[1] 
            },1000)
        }
    }
}
</script>

<style lang="scss">
	.content {
        .header-bg{
            width: 100%;
            height: 500rpx;
            background: url('/static/login/login-bg.png') no-repeat;
            background-size: 100% 100%;
            background-position: center -16rpx;
            padding-bottom: 160rpx;
        }
        .box{
            padding: 70rpx 66rpx 20rpx;
            font-size: 24rpx;
        }
	}
</style>
